<div class="topBox">
  <img [src]="topLeftBtn?.icon" class="close-btn" onerror="this.src='assets/img/close.png'"
    [ngStyle]="titleCloseIconCssStyle|styleFilter" appDebounceClick (debounceClick)="closeModal()" />
  <span class="register-btn" *ngIf="!isHiddenSwitchIcon" appDebounceClick (debounceClick)="goPage(tagData.register.link)"
    [ngStyle]="tagData.register.style|styleFilter">
    <img onerror="this.src='assets/fw/switch.png'" *ngIf="!isHiddenSwitchIcon" class="switch-png"
      src="assets/fw/switch.png" /></span>
  <span *ngIf="tagData.titleBar?.textButton" [ngStyle]="tagData.titleBar?.textButton?.cssStyle|styleFilter"
    appDebounceClick (debounceClick)="goPage(tagData.titleBar.textButton.link)">{{tagData.titleBar?.textButton?.label}}</span>
</div>

<!--手机快捷登录-->
<ng-container *ngIf="this.tagData.style==='mobileLogin'">
  <form [formGroup]="registerForm">
    <div class="mt45 ml30 mb30">
      <p class="title-span" [ngStyle]="titleCssStyle|styleFilter">{{tagData.title}}</p>
      <p class="tips" [ngStyle]="tipsCssStyle|styleFilter">{{tagData.tips}}</p>
    </div>
    <ion-list>
      <ion-item lines="full">
        <ion-input type="mobile" formControlName="account" [(ngModel)]="accountNum" placeholder="请输入手机号码" maxlength="11"
          required></ion-input>
        <span *ngIf="registerForm.value.account" appDebounceClick (debounceClick)="accountNum=''" class="close r90"></span>
        <button class="vccode" *ngIf="time>-1" [disabled]="time>-1"
          [ngClass]="{'lightgrey':time>-1}">({{time}})秒之后重试</button>
        <button class="vccode" *ngIf="time===-1" appDebounceClick (debounceClick)="getVC(registerForm.get('account').errors)">{{text}}</button>
      </ion-item>
      <ion-item lines="full">
        <ion-input required type="number" formControlName="mvcode" [(ngModel)]="mvcode" maxlength="6"
          placeholder="请输入验证码" onInput="if(value.length>6)value=value.slice(0,6)"></ion-input>
        <span *ngIf="registerForm.value.mvcode" appDebounceClick (debounceClick)="mvcode=''" class="close"></span>
      </ion-item>

      <ng-container *ngIf="layoutBelowPrivacy==='true'; else buttonPrivacyTemplate">
        <ion-button [ngStyle]="buttonCssStyle|styleFilter" [disabled]="disableBtn" color="laijian" type="button"
          class="register-btn btn" expand="block" appDebounceClick (debounceClick)="submit()">
          <span class="button-label">{{tagData.button.label}}</span>
        </ion-button>
        <ion-item lines="none" class="clear-left-item">
          <div class="check-box-div" appDebounceClick (debounceClick)="checkRead()">
            <ng-container *ngIf="this.isCheckRead===true">
              <i class="checkicon"></i>
            </ng-container>
            <ng-container *ngIf="this.isCheckRead===false">
              <i class="uncheckicon"></i>
            </ng-container>
            <label class="checkbox">我已阅读并同意</label>
          </div>
          <span class="f12 blue" appDebounceClick (debounceClick)="openArgument()">《蜂喔用户协议》</span>
          <span class="f12 blue " appDebounceClick (debounceClick)="alertPrivacyPolicy()">《隐私政策》</span>
        </ion-item>
      </ng-container>
      <ng-template #buttonPrivacyTemplate>
        <ion-item lines="none" class="clear-left-item">
          <div class="check-box-div" appDebounceClick (debounceClick)="checkRead()">
            <ng-container *ngIf="this.isCheckRead===true">
              <i class="checkicon"></i>
            </ng-container>
            <ng-container *ngIf="this.isCheckRead===false">
              <i class="uncheckicon"></i>
            </ng-container>
            <label class="checkbox">我已阅读并同意</label>
          </div>
          <span class="f12 blue" appDebounceClick (debounceClick)="openArgument()">《蜂喔用户协议》</span>
          <span class="f12 blue " appDebounceClick (debounceClick)="alertPrivacyPolicy()">《隐私政策》</span>
        </ion-item>
        <ion-button [ngStyle]="buttonCssStyle|styleFilter" [disabled]="disableBtn" color="laijian" type="button"
          class="register-btn btn" expand="block" appDebounceClick (debounceClick)="submit()">
          <span class="button-label">{{tagData.button.label}}</span>
        </ion-button>
      </ng-template>
      <p class="p-bottom" *ngIf="tagData.otherLink" appDebounceClick (debounceClick)="goPage1(tagData.otherLink)">{{tagData.otherLink.label}}</p>


      <div *ngIf="tagData.wxLink" class="wxLink" [ngStyle]="tagData.wxLink.cssStyle|styleFilter">
        <font [ngStyle]="tagData.wxLink?.params?.labelCssStyle|styleFilter">{{tagData.wxLink.label}}</font>
        <img *ngIf="true" class="wxIconLink" [src]="tagData.wxLink.iconUrl" appDebounceClick (debounceClick)="wxAuth()"
          [ngStyle]="tagData.wxLink?.params?.iconUrlCssStyle|styleFilter"
          onerror="this.src='https://zeno-img.oss-cn-shenzhen.aliyuncs.com/file_1681872642016c1dd7a9ed539d5a81e5806ac3e5e078a.png'" />
      </div>



    </ion-list>



  </form>
</ng-container>

<!--账号密码登录-->
<ng-container *ngIf="this.tagData.style==='accAndPwdLogin'">
  <form [formGroup]="registerForm2">
    <div class="mt45 ml30 mb30">
      <p class="title-span" [ngStyle]="titleCssStyle|styleFilter">{{tagData.title}}</p>
      <p class="tips" [ngStyle]="tipsCssStyle|styleFilter">{{tagData.tips}}</p>
    </div>
    <ion-list>
      <ion-item lines="full">
        <ion-input #accountInput type="mobile" formControlName="account" [(ngModel)]="mobileNum" placeholder="请输入手机号码" maxlength="11"
          required></ion-input>
        <span *ngIf="registerForm2.value.account" appDebounceClick (debounceClick)="mobileNum=''" class="close r50"></span>
      </ion-item>
      <ion-item lines="full">
        <ion-input #passwordInput required type="{{open?'text':'password'}}" maxlength="50" [(ngModel)]="passwordNum"
          formControlName="password" placeholder="请输入密码"></ion-input>
        <span *ngIf="registerForm2.value.password" appDebounceClick (debounceClick)="passwordNum=''" class="close r50"></span>
        <span class="eye" appDebounceClick (debounceClick)="open=!open" [ngClass]="{'eyeshow':open}"></span>
      </ion-item>

      <ng-container *ngIf="layoutBelowPrivacy==='true'; else buttonPrivacyTemplate1">
        <ion-button [ngStyle]="buttonCssStyle|styleFilter" [disabled]="disableBtn" color="laijian" type="button"
          class="register-btn btn" expand="block" appDebounceClick (debounceClick)="submit(2)">

          <span class="button-label">{{tagData.button.label}}</span>
        </ion-button>

        <p class="p-bottom">
          <span class="span-bottom-first" *ngIf="tagData.otherLink" appDebounceClick (debounceClick)="goPage1(tagData.otherLink)">
            {{tagData.otherLink.label}}</span>
          <span class="span-bottom-second 1" *ngIf="tagData.forget" appDebounceClick (debounceClick)="goPage(tagData.forget.link)">
            {{tagData.forget.name}}</span>
        </p>

        <ion-item lines="none" class="clear-left-item">
          <div class="check-box-div" appDebounceClick (debounceClick)="checkRead()">
            <ng-container *ngIf="this.isCheckRead===true">
              <i class="checkicon"></i>
            </ng-container>
            <ng-container *ngIf="this.isCheckRead===false">
              <i class="uncheckicon"></i>
            </ng-container>
            <label class="checkbox">我已阅读并同意</label>
          </div>
          <span class="f12 blue" appDebounceClick (debounceClick)="openArgument()">《蜂喔用户协议》</span>
          <span class="f12 blue " appDebounceClick (debounceClick)="alertPrivacyPolicy()">《隐私政策》</span>
        </ion-item>
      </ng-container>
      <ng-template #buttonPrivacyTemplate1>
        <ion-item lines="none" class="clear-left-item">
          <div class="check-box-div" appDebounceClick (debounceClick)="checkRead()">
            <ng-container *ngIf="this.isCheckRead===true">
              <i class="checkicon"></i>
            </ng-container>
            <ng-container *ngIf="this.isCheckRead===false">
              <i class="uncheckicon"></i>
            </ng-container>
            <label class="checkbox">我已阅读并同意</label>
          </div>
          <span class="f12 blue" appDebounceClick (debounceClick)="openArgument()">《蜂喔用户协议》</span>
          <span class="f12 blue " appDebounceClick (debounceClick)="alertPrivacyPolicy()">《隐私政策》</span>
        </ion-item>
        <ion-button [ngStyle]="buttonCssStyle|styleFilter" [disabled]="disableBtn" color="laijian" type="button"
          class="register-btn btn" expand="block" appDebounceClick (debounceClick)="submit(1)">
          <span class="button-label" [ngStyle]="buttonLabelCssStyle|styleFilter">{{tagData.button.label}}</span>
        </ion-button>

        <p class="p-bottom">
          <span class="span-bottom-first" *ngIf="tagData.otherLink" appDebounceClick (debounceClick)="goPage1(tagData.otherLink)">
            {{tagData.otherLink.label}}</span>
          <span class="span-bottom-second 2" *ngIf="tagData.forget" appDebounceClick (debounceClick)="goPage(tagData.forget.link)">
            {{tagData.forget.name}}</span>
        </p>



        <div *ngIf="tagData.wxLink" class="wxLink" [ngStyle]="tagData.wxLink.cssStyle|styleFilter">
          <font [ngStyle]="tagData.wxLink?.params?.labelCssStyle|styleFilter">{{tagData.wxLink.label}}</font>
          <img *ngIf="true" class="wxIconLink" [src]="tagData.wxLink.iconUrl" appDebounceClick (debounceClick)="wxAuth()"
            [ngStyle]="tagData.wxLink?.params?.iconUrlCssStyle|styleFilter"
            onerror="this.src='https://zeno-img.oss-cn-shenzhen.aliyuncs.com/file_1681872642016c1dd7a9ed539d5a81e5806ac3e5e078a.png'" />
        </div>


      </ng-template>



    </ion-list>
  </form>

</ng-container>